JavaScript Password for page

This example shows how you can add simple password protection to a page

Please note that JavaScript is currently only available in Netscape Navigator 2.0 and Explorer 3.01 or higher. Do not assume that all in your audience are using a JavaScript enabled browser.

Here is an example on how JavaScript can be used to implement simple password protection of a page. The idea behind this JavaScript-based password protection, is that the user should know a part of the page's name (or directory), and enter this in a field inside a HTML form. A JavaScript function is then used to calculate the correct URL to the page and to display the page.

In the example below, you can use the following passwords, "groucho", "harpo", "chico" or "zeppo".

Enter password and click the OK button:

How to use

The source of the form with the field and OK button looks like this: 

<FORM NAME="theForm">
Enter password and click the button: <INPUT NAME="txtPassword" TYPE=Password
 SIZE="12" MAXLENGTH="10">
<INPUT NAME="bOK" TYPE=Button VALUE="OK" 
onClick="getThePage(theForm.txtPassword.value)">
</FORM>

Copy this part to the body section of your page. The function named getThePage() is called when the user clicks upon the button. In this function the location if the hidden page is calcuted by simply adding .html to the password. Place this function in the SCRIPT section in the HEAD part of your page: 

function getThePage(thePW)
{
	top.location.href = thePW + ".html"
}

The URL to the page is never displayed in the source of page, so this will give some security, unless the name of the page is easy to guess. Note that this kind of JavaScript-based protection is useless if your web server allows users to list all files and folders in your directory. For example, Personal Web Sharing included with MacOS 8 have this feature.